<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib uri="/struts-tags" prefix="s" %>  
    <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>  
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
	.text{}
</style>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-3.2.0.js">
</script>
<script type="text/javascript" >
/* 	function countPrice(num,price){
		var sum = 0;
		sum = num * price;
		var total = 0;
		$("#count").html(sum);
		$("#total").html("");
		<c:forEach items="${session.forder.shop }" var="sorder" varStatus="num">
			total = $("#count_${num.index+1}").val();
		</c:forEach>
	} */
	var flag = false;
	
	$(function(){
		//注册事件
		$(".text").change(function(){
		//验证数据的有效性
			var number = this.value; //也可以使用$(this).val();
			//isNaN(number)表示若number不是数字就返回真
			if(!isNaN(number) && parseInt(number)==number && number>0){ 
				
				//如果合法，同步更新的数
				$(this).attr("lang", number);
				//找到当前标签中第一个是tr的父节点，然后拿到属性为lang的值，也就是商品的id
				var pid = $(this).parents("tr:first").attr("lang");
				//发送Ajax请求，传输当前的数量与商品的id，返回修改数量后的总价格
				$.ajaxSettings.async = false;
				$.post("shopAction_updateFood.action", {num:number, 'food.id':pid}, function(total){
					/* 	alert(${session.forder.totalmount});
					 $("#total").html(${session.forder.totalmount}); //所有商品的小计
					var yunfei = $("#yunfei").html();
					$("#totalAll").html(${session.forder.totalmount}); //所有商品小计和运费的和  */
				}, "text");
				//计算单个商品的小计，保留两位小数
				/* var price = ($(this).parent().prev().html()*number).toFixed(2);
				$(this).parent().next().html(price); */
				flag = true;
				check(flag);
			} else {
				//如果非法，还原为刚刚合法的数
				this.value = $(this).attr("lang");
			}
		})
	})
	
	function check(f){
		if(f){
			location.reload(); 
		}
		$.ajaxSettings.async = true;
	}
	function deleteFood(id){
		$.ajaxSettings.async = false;
		$.post("shopAction_deleteFood.action", {'food.id':id}, function(total){
			/* 	alert(${session.forder.totalmount});
			 $("#total").html(${session.forder.totalmount}); //所有商品的小计
			var yunfei = $("#yunfei").html();
			$("#totalAll").html(${session.forder.totalmount}); //所有商品小计和运费的和  */
		});
		flag = true;
		check(flag);
	}	
	
	function deleteAll(){
		$.ajaxSettings.async = false;
		$.post("shopAction_deleteAll.action", function(total){
			/* 	alert(${session.forder.totalmount});
			 $("#total").html(${session.forder.totalmount}); //所有商品的小计
			var yunfei = $("#yunfei").html();
			$("#totalAll").html(${session.forder.totalmount}); //所有商品小计和运费的和  */
		});
		flag = true;
		check(flag);
	}				
	function checkOrder(){

		var name = document.getElementById("name").value;
		var phone = document.getElementById("phone").value;
		var address = document.getElementById("address").value;
		
		if(name == null || name == ""){
			alert("姓名不能为空");
			return false;
		}
		if(address == null || address == ""){
			alert("地址不能为空");
			return false;
		}
		if(phone == null || phone == ""){
			alert("电话号码不能为空");
			return false;
		}
 		 if(!/^[0-9]*$/.test(phone) || phone.length != 11){  
			alert("请输入有效的电话号码");
			return false;
		} 
		return true;
	}
</script>
<link href="css/footer.css" type="text/css" rel="stylesheet"/>
</head>
<body>
			<div id="shopping_cart">
				<br>
				<div id="head" align="center">
				<table  cellpadding="0" cellspacing="0">
					<h2 align="center" style="margin-right: 700px">订单详情</h2>
					<tr>
						<th class="" width="10%">序号</th>
						<th class="" width="35%">商品名称</th>
						<th class="" width="10%">销售价格</th>
						<th class="" width="20%">数量</th>
						<th class="" width="15%">小计</th>
					</tr>
						<tr style="height:5px">
							</tr>
					<c:forEach items="${session.shop }" var="sorder" varStatus="num">
						<tr lang="${sorder.id}">
							 <td align="center" >${num.index+1 }
							</td> 
							<td align="center">${sorder.name }
							</td>
							<td align="center">
								<span id="price">${sorder.price }元</span>	
							</td>
							<td align="center">
								<span>${sorder.num }</span>		
							</td >
							<td align="center">
								<span  id="count_${num.index+1 }">${sorder.price*sorder.num }元</span>
							</td>
						</tr>
						<tr style="height:5px">
							</tr>
						
					</c:forEach>
				</table>
				</div>
				<br>
		
			</div>
</body>
</html>